import logo from './logo.svg';
import './App.css';
import ComponentA from './ComponentA';
import ComponentB from './ComponentB';
import { useCallback, useState } from 'react';

//memo 允许你的组件在 props 没有改变的情况下跳过重新渲染。

function App() {
  const [count,setCount] = useState(3)
  const [other,setOther] = useState(5)
  const handleSubmit = useCallback(()=>{
    console.log("do something",count)
  },[count])
  // const handleSubmit = ()=>{
  //   console.log("do something")
  // }
  return (
    <div className="App">
      <button onClick={()=>setOther(other+1)}>+1</button>
      {other}
      <ComponentA count={count} handleSubmit={handleSubmit}></ComponentA>
      <ComponentB></ComponentB>
    </div>
  );
}

export default App;
//https://juejin.cn/post/6844904072168865800